Website Gallery page building #850

skzhang1 · 2023-12-03T17:03:25Z

Why are these changes needed?

There are many interesting examples and resources from discord, twitter, linkedin, medium, youtube, reddit, github.
We need to build a gallery page to collect these interesting examples and encourage the community to enrich the content.

Related issue number

Closes #830

Tasks

Change the gallery page style. Show each example with title + icon + link. Now it is a markdown page.

Checks

I've included any doc changes needed for https://microsoft.github.io/autogen/. See https://microsoft.github.io/autogen/docs/Contribute#documentation to build and test documentation locally.
I've added tests (if relevant) corresponding to the changes introduced in this PR.
I've made sure all auto checks have passed.

codecov-commenter · 2023-12-03T17:04:53Z

Codecov Report

All modified and coverable lines are covered by tests ✅

Project coverage is 26.58%. Comparing base (1b4fb8f) to head (e0bbe74).
Report is 786 commits behind head on main.

Additional details and impacted files

@@           Coverage Diff           @@
##             main     #850   +/-   ##
=======================================
  Coverage   26.58%   26.58%           
=======================================
  Files          28       28           
  Lines        3732     3732           
  Branches      847      847           
=======================================
  Hits          992      992           
  Misses       2667     2667           
  Partials       73       73

Flag	Coverage Δ
unittests	`26.52% <ø> (ø)`

Flags with carried forward coverage won't be shown. Click here to find out more.

☔ View full report in Codecov by Sentry.
📢 Have feedback on the report? Share it here.

sonichi · 2023-12-03T17:11:14Z

Does the page render as a gallery?

skzhang1 · 2023-12-03T17:15:22Z

@sonichi Now it is rendered using a markdown page. I am now trying to make it render as a gallery.

sonichi

Is it possible to add tags for each? It'll be hard to browse.

website/docs/Gallery.md

skzhang1 · 2023-12-03T19:28:43Z

Is it possible to add tags for each? It'll be hard to browse.

Currently I show the catalog on the right. Users could also search them using the search box on the top.

sonichi · 2023-12-03T19:30:58Z

Is it possible to add tags for each? It'll be hard to browse.

Currently I show the catalog on the right. Users could also search them using the search box on the top.

adding tag will help search.

victordibia · 2023-12-04T01:25:29Z

@sonichi Now it is rendered using a markdown page. I am now trying to make it render as a gallery.

Hi @skzhang1 , my current intuition is that we will benefit from building a custom (reusable) react component that can format data as a gallery. I am not sure how to accomplish it yet, but can do some research and share my findings.

victordibia · 2023-12-04T05:42:39Z

My findings so far are as follows:

We can create an .mdx file instead of .md for the galler. .mdx lets us add custom React components.
We can define a gallery.json and represent each item as an entry

[
  {
    "title": "AutoGen Playground",
    "link": "https://huggingface.co/spaces/thinkall/AutoGen_Playground",
    "description": "A space to explore the capabilities of AutoGen.",
    "image": "default.png",
    "tags": ["web", "app"]
  },
  ...
  ]

Create a custom react component that loads and renders the gallery. We can implement behaviors like search by tags etc.

I have some sample code for this .. the result being below.

@skzhang1 is it ok if I committed the code to this PR and then you can modify it as needed? let me know.

@sonichi .. is this close to what you are envisioning?

sonichi · 2023-12-04T06:17:31Z

Yes. Looks great!

skzhang1 · 2023-12-04T13:14:09Z

@sonichi Now it is rendered using a markdown page. I am now trying to make it render as a gallery.

Hi @skzhang1 , my current intuition is that we will benefit from building a custom (reusable) react component that can format data as a gallery. I am not sure how to accomplish it yet, but can do some research and share my findings.

@victordibia It looks great to me! Can you make a commit for that? We will enrich the content correspondingly.

…rl state management

victordibia · 2023-12-04T17:06:12Z

@victordibia It looks great to me! Can you make a commit for that? We will enrich the content correspondingly.

@skzhang1, I made a commit. Thanks for taking the lead and helping with this feature, it will really help the community
Please feel free to double check and modify the content of gallery.json for completeness.

Note: You might have to run yarn install again to update dependencies (mainly support the the antd library)

skzhang1 · 2023-12-04T23:37:58Z

@victordibia Thanks for your help! I made small changes to the content. Now this PR looks good to me. I will add icons to these applications in another PR. I think we can merge these PR and encourage uses to submit their demos in the community at first. Can you check the content again? @sonichi @qingyun-wu Thanks!

victordibia

Looks good to me.
I agree that it might be a good idea add some icons or color coding to each tag.
We might also want an author field to indicate if it is a community example or by the autogen team. And yes, let us work on that on a different PR.

Thanks again for working on this!

sonichi

I didn't go through all the examples. I checked a few and commented.

website/docs/Gallery.mdx

website/src/data/gallery.json

sonichi

For the case when image is not provided, I meant rendering the image contained in the linked page, like the gallery forum in discord: https://discord.com/channels/1153072414184452236/1161015724521836634
It it's hard to do it here, we can use a common default image as proposed, but the default image needs to be replaced by a more commonly representative image like the autogen landing image.

website/docs/Ecosystem.md

website/docs/img/ecosystem_SemanticKernel.png

website/src/data/gallery.json

website/static/img/gallery/default.png

* initial draft * update dependences, add antd for layout (note yarn install needed her) * update gallery to use mdx file format to support react components * add custom react component for gallery with tag based filtering and url state management * add styling for gallery objects * add gallery data structure and default image * improve layout for gallerypage * revise Postgres demo * add default value when image is not provided * move semetic kernal to ecosystem * update tags * update tags * update ecosystem * update default fig * update tags * reformat --------- Co-authored-by: “skzhang1” <“shaokunzhang529@gmail.com”> Co-authored-by: Victor Dibia <victordibia@microsoft.com>

…s specified, then effectively zero-shot AutoML is used (microsoft#850) * Added an info reminding user that if no time_budget and no max_iter is specified, then effectively zero-shot AutoML is used * moved message to line 2818 * Update flaml/automl/automl.py Co-authored-by: Chi Wang <wang.chi@microsoft.com> * Update flaml/automl/automl.py Co-authored-by: Chi Wang <wang.chi@microsoft.com> Co-authored-by: Chi Wang <wang.chi@microsoft.com> Co-authored-by: Qingyun Wu <qingyun.wu@psu.edu>

* initial draft * update dependences, add antd for layout (note yarn install needed her) * update gallery to use mdx file format to support react components * add custom react component for gallery with tag based filtering and url state management * add styling for gallery objects * add gallery data structure and default image * improve layout for gallerypage * revise Postgres demo * add default value when image is not provided * move semetic kernal to ecosystem * update tags * update tags * update ecosystem * update default fig * update tags * reformat --------- Co-authored-by: “skzhang1” <“shaokunzhang529@gmail.com”> Co-authored-by: Victor Dibia <victordibia@microsoft.com>

initial draft

8322432

skzhang1 requested review from olaoluwasalami, qingyun-wu and sonichi December 3, 2023 17:03

skzhang1 self-assigned this Dec 3, 2023

Merge branch 'main' into web_gallery

482b448

skzhang1 added the documentation Improvements or additions to documentation label Dec 3, 2023

sonichi reviewed Dec 3, 2023

View reviewed changes

website/docs/Gallery.md Outdated Show resolved Hide resolved

website/docs/Gallery.md Outdated Show resolved Hide resolved

sonichi requested a review from JingyaChen December 3, 2023 18:10

sonichi mentioned this pull request Dec 3, 2023

Integrate the initiate_chat with Streamlit/Gradio. #740

Closed

qingyun-wu requested a review from victordibia December 3, 2023 19:49

skzhang1 mentioned this pull request Dec 4, 2023

Enrich ecosystem page #821

Closed

sonichi mentioned this pull request Dec 4, 2023

add example to website #860

Merged

2 tasks

victordibia added 7 commits December 4, 2023 07:33

update dependences, add antd for layout (note yarn install needed her)

d55f7dd

update gallery to use mdx file format to support react components

332ea3c

add custom react component for gallery with tag based filtering and u…

da77348

…rl state management

add styling for gallery objects

bb3fbf2

add gallery data structure and default image

90826cd

improve layout for gallerypage

8f230ba

Merge branch 'main' into web_gallery

b54c85b

victordibia mentioned this pull request Dec 4, 2023

Discoverability of examples and resources #830

Closed

“skzhang1” and others added 2 commits December 4, 2023 18:32

revise Postgres demo

abbfc3c

Merge branch 'main' into web_gallery

f57abfc

victordibia approved these changes Dec 5, 2023

View reviewed changes

sonichi reviewed Dec 5, 2023

View reviewed changes

website/docs/Gallery.mdx Show resolved Hide resolved

website/src/data/gallery.json Outdated Show resolved Hide resolved

website/src/data/gallery.json Outdated Show resolved Hide resolved

website/src/data/gallery.json Outdated Show resolved Hide resolved

victordibia and others added 4 commits December 4, 2023 21:41

add default value when image is not provided

caf314a

move semetic kernal to ecosystem

5c81e34

update tags

2c12159

update tags

900c053

skzhang1 requested a review from sonichi December 5, 2023 15:05

skzhang1 added 2 commits December 5, 2023 13:55

Merge branch 'main' into web_gallery

d00f6fb

Merge branch 'main' into web_gallery

3a0c175

sonichi reviewed Dec 6, 2023

View reviewed changes

“skzhang1” added 4 commits December 6, 2023 14:24

update ecosystem

cbe3a16

update default fig

a2bc141

update tags

0cca418

reformat

2cc1111

skzhang1 requested review from sonichi and thinkall December 7, 2023 15:53

qingyun-wu enabled auto-merge December 7, 2023 22:38

Merge branch 'main' into web_gallery

e0bbe74

qingyun-wu added this pull request to the merge queue Dec 8, 2023

Merged via the queue into main with commit 69aaea5 Dec 8, 2023
16 checks passed

victordibia deleted the web_gallery branch December 18, 2023 01:28

qingyun-wu mentioned this pull request Dec 21, 2023

Website improvements #1041

Closed

Provide feedback

Saved searches

Use saved searches to filter your results more quickly

Website Gallery page building #850

Website Gallery page building #850

skzhang1 commented Dec 3, 2023 •

edited

Loading

codecov-commenter commented Dec 3, 2023 •

edited

Loading

sonichi commented Dec 3, 2023

skzhang1 commented Dec 3, 2023

sonichi left a comment

skzhang1 commented Dec 3, 2023

sonichi commented Dec 3, 2023

victordibia commented Dec 4, 2023

victordibia commented Dec 4, 2023 •

edited

Loading

sonichi commented Dec 4, 2023

skzhang1 commented Dec 4, 2023 •

edited

Loading

victordibia commented Dec 4, 2023 •

edited

Loading

skzhang1 commented Dec 4, 2023

victordibia left a comment

sonichi left a comment

sonichi left a comment

Website Gallery page building #850

Website Gallery page building #850

Conversation

skzhang1 commented Dec 3, 2023 • edited Loading

Why are these changes needed?

Related issue number

Tasks

Checks

codecov-commenter commented Dec 3, 2023 • edited Loading

Codecov Report

sonichi commented Dec 3, 2023

skzhang1 commented Dec 3, 2023

sonichi left a comment

Choose a reason for hiding this comment

skzhang1 commented Dec 3, 2023

sonichi commented Dec 3, 2023

victordibia commented Dec 4, 2023

victordibia commented Dec 4, 2023 • edited Loading

sonichi commented Dec 4, 2023

skzhang1 commented Dec 4, 2023 • edited Loading

victordibia commented Dec 4, 2023 • edited Loading

skzhang1 commented Dec 4, 2023

victordibia left a comment

Choose a reason for hiding this comment

sonichi left a comment

Choose a reason for hiding this comment

sonichi left a comment

Choose a reason for hiding this comment

skzhang1 commented Dec 3, 2023 •

edited

Loading

codecov-commenter commented Dec 3, 2023 •

edited

Loading

victordibia commented Dec 4, 2023 •

edited

Loading

skzhang1 commented Dec 4, 2023 •

edited

Loading

victordibia commented Dec 4, 2023 •

edited

Loading